import React, { Component } from 'react';
import { Input, Select } from 'antd';
import { connect } from 'dva';

@connect(state => state)
export default class SearchKeyword extends Component {


  wordChange = (e) => {
    const { dispatch, namespace } = this.props;
    dispatch({
      type: `${namespace}/updateSearchWord`,
      payload: e.target.value,
    });
  }

  selChange = key => {
    const { dispatch, namespace } = this.props;
    dispatch({
      type: `${namespace}/updateSearchKey`,
      payload: key,
    });
  }

  render() {
    const { columns = [], namespace } = this.props;
    const currState = this.props[namespace];
    const { searchKey, keyword } = currState;
    return (
      <div>
        <Select
          style={{ minWidth: '9em', marginRight: 10 }}
          value={searchKey}
          onChange={this.selChange}
        >
          {columns
            .map(c =>
              (<Option value={c.dataIndex}>{c.title}</Option>))}
        </Select>
        <Input
          onChange={this.wordChange}
          placeholder="请输入关键字"
          value={keyword}
          style={{ width: '15em' }}
        />
      </div>
    );
  }
}

